
// This function handles the nickname stuff.
// It's used for changing the nickname , and showing the UI for the nickname in the main window.

var ChatboxNickname = new Class({
	// Set a nickname when possible.
	initialize: function(nickname)
	{
		// Initialize the nickname variable
		this.nick      = null;
		
		// There is a nickname specified so update it.
		// TODO: Track this whole thing down
		if (nickname != null)
			this.setNickname(nickame);
		
	}, // end function initialize
	
	// Send a request to the server for nickname  changing.
	setNickname: function(n, uA)
	{
		// If there is no nickname specified YET, it means we're just getting it from the server
		// so, when the nickname in the inner class is still empty.. just trigger the onDone 'event'.
		if (this.nick != null)
			
			// We're setting a NEW nickname. So we need to update the server.
			chat.getClsAjaxReq().request('chat.nickname.change', ['n'], [n], function(r)
			{
				// now we can update the UI
				chat.getChat().getClsNickname().setNicknameDone(r);
				
			}, 'Altering nickname.', 2);
		else
			// Just update the UI
			this.setNicknameDone(n);
		
	}, // end function onChange
	
	// Updates the UI when a new nickname is specified.
	setNicknameDone: function(n)
	{
		// Save the nickname in the class
		this.nick = n;
		
		// Update the GUI (Main Window)
		$('panel_main_nickname').innerHTML = '<img id="status_changeButton" src="ui/icons/status_' + chat.getChat().getClsContacts().getStatusIcon(chat.getClsSession().getStatus()) + '.gif"> <span alt="Click here to change your nickname." onClick="setChangeNick();" style="padding: 2px;">' + n + '&nbsp;</span>';
		
		// This function makes the status dropdown 'button' active. So the user can change their
		// status when they click on their status icon in the main window
		this.makeStatusButtonActive();
	},
	
	// This function creates a dropdown menu for the status icon.
	showStatusChange: function(event)
	{
		// Specify a new list with all the 'standard' statuses the user can chose from.
		$('panel_main_status').innerHTML = '<table cellspacing=0 cellpadding=0 width="100%" id="t">' + 
			'<tr id="status_change_cancel" class="h1"><td width=20>&nbsp;</td><td class="txt">Cancel</td>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_online.gif"></td><td class="txt">Online</td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_away.gif"></td><td class="txt">Away</td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_away.gif"></td><td class="txt">Be right back</td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_busy.gif"></td><td class="txt">Busy</td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_busy.gif"></td><td class="txt">On the phone</td></tr>' + 
			'<tr class="s"><td width=20></td><td class="txt"><div class="a">&nbsp;</div><div class="b">&nbsp;</div><div class="c">&nbsp;</div></td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_away.gif"></td><td class="txt">Custom Away</td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_busy.gif"></td><td class="txt">Custom Busy</td></tr>' + 
			'<tr class="s"><td width=20></td><td class="txt"><div class="a">&nbsp;</div><div class="b">&nbsp;</div><div class="c">&nbsp;</div></td></tr>' + 
			'<tr class="t"><td width=20><img border=0 src="ui/icons/status_offline.gif"></td><td class="txt">Appear offline!</td></tr>' +
			'<tr id="status_change_cancel" class="h2"><td width=20>&nbsp;</td><td class="txt">Cancel</td>' + 
			'</table>';
			
		// Specify some style stuff.
		$('panel_main_status').style.display = '';
		$('panel_main_status').style.top = null;
		$('panel_main_status').style.position = 'absolute';
		$('panel_main_status').style.width = '150px';
		// TODO: remove the debug
		$('debug').innerHTML = ($('panel_main_status').getPosition()['y'] + $('panel_main_status').getSize()['size']['y']) + '>' +  winHeight;
		
		// When the dropdown thing doesn't fit on the screen anymore, place it above the cursor.
		if (($('panel_main_status').getPosition()['y'] + $('panel_main_status').getSize()['size']['y']) > winHeight)
			$('panel_main_status').style.top = (0 - $('panel_main_status').getSize()['size']['y']) + 'px';
		
		// Enable the hovering effect.
		enable_hovering_for('tr');
		
		// When we click on a new status... trigger an even to change the status to this.
		$$('#panel_main_status #t tr.t').forEach(function(el)
		{
			el.onclick = chat.getChat().getClsNickname().selectStatus.bindWithEvent(el);
			
		});
		
		// When we click on cancel, close the dialog.
		$$('#panel_main_status #t #status_change_cancel').forEach(function(el)
		{
			el.onclick = function() {
				// Close the panel
				$('panel_main_status').innerHTML = '';
				$('panel_main_status').style.display = 'none';
			};
			
		});
		
	}, // end function showStatusChange
	
	// This function updates the user status after the user has clicked in the
	// update status pane on a new status
	selectStatus: function(event)
	{
		// We got an event here, we're we need the parentNode HTML to parse.
		var html = event.target.parentNode.innerHTML.toLowerCase();
		
		// Because this is just plain HTML, we're going to specify the state number
		// and detailed status by parsing the HTML
		
		var record = "";
		var image = "";
		var status_ed = "";
		var status = 0;
		
		// Go through every character and parse it
		for (var i = 0; i < html.length; i++)
		{
			// Is from this character and 16 further equal to some of the image path?
			if (html.substring(i, i+16) == 'ui/icons/status_')
			{
				// Cool, skip 16 characters and record the icon filename.
				i = i+16;
				
				record = 1;
				
			} // end if
			
			// FF uses different HTML for specifying class="xx" than IE
			if (html.substring(i, i+12) == 'class="txt">')
			{
				// Skip 12 characters (10 for IE) to get the detailed status.
				i = i+12;
				
				record = 2;
				
			} // end if
			
			// Support for IE,,
			if (html.substring(i, i+10) == 'class=txt>')
			{
				i = i+10;
				
				record = 2;
				
			} // end if
			
			// Record the image filename
			if (record == 1)
			{
				// Are we at the end yet? If so, stop parsing this
				// Otherwise: add this character.
				if (html.substring(i, i+4) == '.gif')
					record = 0;
				else
					image = image + html.substring(i, i+1);
				
				continue;
				
			} // end if
			
			// Record the detailed status
			if (record == 2)
			{
				// Are we at the end yet? If so; quit parsing (we're done)
				// Otherwise: add this charachter.
				if (html.substring(i, i+2) == '</')
					break;
				else
					status_ed = status_ed + html.substring(i, i+1);
					
			} // end if
			
		} // end for
		
		// Translate the status to a number again.
		status = chat.getChat().getClsContacts().getStatusNo(image);
		
		// Close the panel
		$('panel_main_status').innerHTML = '';
		$('panel_main_status').style.display = 'none';
		
		// Requesting update.
		chat.getClsAjaxReq().request('chat.status.change', ['sd', 'sn'], [status_ed, status], function(r)
		{
			// Split on lines
			var lines = r.split("\n");
			
			// Save the new state number and detailed status
			chat.getClsSession().setStatus(lines[0]);
			chat.getClsSession().setStatusDe(lines[1]);
			
			// Change the icon
			$('status_changeButton').src = 'ui/icons/status_' + chat.getChat().getClsContacts().getStatusIcon(lines[0]) + '.gif';
			
		}, 'Updating status', 2)
		
	},
	
	// This function adds an onClick event on the buddy icon in your main window.
	makeStatusButtonActive: function()
	{
		$('status_changeButton').onclick = this.showStatusChange.bindWithEvent($('status_changeButton'));
		
	}, // end function makeStatusButtonActive
	
	// This function replaces the nickname div with a input widget when the user had clicked on it.
	doChangeForm: function()
	{
		$('panel_main_nickname').innerHTML = 
			'<form method="POST" action="" onSubmit="changeNick($(\'chat_nickname_new\').value); return false;">' + 
			'<img id="status_changeButton" onClick="setChangeStatus();" src="ui/icons/status_' + chat.getChat().getClsContacts().getStatusIcon(chat.getClsSession().getStatus()) + '.gif"> <input type="text" name="nickname" id="chat_nickname_new" value="' + this.nick + '" style="border: 0px; padding: 2px; background-color: #DDD;">' +
			'</form>';
		
		// And make the buddy icon also active!	
		this.makeStatusButtonActive();
	},
	
	// Reset everything
	reset: function()
	{
		this.nick = null;
		
	},
	
	getNickname: function()
	{
		return this.nick;
		
	}
	
});

// We've clicked on the nickname (normal state).
// That means the user might want to change it.
setChangeNick = function()
{
	chat.getChat().getClsNickname().doChangeForm();
	
}; // end function setChangeNick

// The form had been submitted.
changeNick = function(n)
{
	// Check if the nickname isn't empty, and also if the nickname is different
	if (n != null && n != chat.getChat().getClsNickname().getNickname())
		// Updating..
		chat.getChat().getClsNickname().setNickname(n);
		
}; // Change nick (from the outside world).

// Yay! Nickname library loaded.
cimport_loaded('chatbox.Nickname');